<template>
  <div style="margin:20px 400px">
    <div align="center">
        <el-button type="primary" @click="weath" style="border-radius: 17px;">查询天气</el-button>

    </div>
    <div style="height: 20px"></div>
    <div id="he-plugin-standard"></div>
  </div>
</template>

<script>
  export default {
    name:'Weather',
    methods:{
      weath(){
        window.WIDGET = {
          "CONFIG": {
            "layout": "1",
            "width": "500",
            "height": "150",
            "background": "1",
            "dataColor": "FFFFFF",
            "borderRadius": "15",
            "key": "a6e63479a28242c7a267184d6d51df93"
          }
        }

        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.src = 'https://widget.qweather.net/standard/static/js/he-standard-common.js?v=2.0';
        document.getElementsByTagName('head')[0].appendChild(script);
      }
    },
  /*  created() {
      window.WIDGET = {
        "CONFIG": {
          "layout": "1",
          "width": "500",
          "height": "150",
          "background": "1",
          "dataColor": "FFFFFF",
          "borderRadius": "15",
          "key": "a6e63479a28242c7a267184d6d51df93"
        }
      }

      var script = document.createElement('script');
      script.type = 'text/javascript';
      script.src = 'https://widget.qweather.net/standard/static/js/he-standard-common.js?v=2.0';
      document.getElementsByTagName('head')[0].appendChild(script);
    }*/
  }
</script>

<style>

</style>
